import type { VbenFormProps } from '#/adapter/form';
import { z } from '#/adapter/form';
import dayjs, { Dayjs } from 'dayjs';
import { ref } from 'vue';
import { sampleArr, testItemsArr, contactPersonOptions, currentProgressOptions } from './data';

let testItemsMap = ref([]);
let contactPersonMap = ref([]);

// 表单通用配置
export const commonFormConfig: VbenFormProps = {
  actionWrapperClass: 'text-center',
  commonConfig: {
    colon: true,
    labelWidth: 125,
    componentProps: {
      class: 'w-full',
    },
  },
  layout: 'horizontal',
  // 大屏一行显示3个，中屏一行显示2个，小屏一行显示1个
  wrapperClass: 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3',
};

export const sampleFormSchemas: VbenFormProps = {
  schema: [
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
        addonBefore: 'RT/JC-WT-',
      },
      formItemClass: 'col-span-3', // 占据两列
      label: '委托单号',
      fieldName: 'orderNo',
      // 使用ZOD验证器，规则为：只能为“/”或者“四位数字-四位数字”
      rules: z.string().regex(/^\/$|^\d{6}-\d{3}$/, '格式错误：YYYYMM-流水号'),
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-3',
      label: '委托单位',
      fieldName: 'clientName',
      rules: 'required',
    },
    {
      component: 'Cascader',
      componentProps: {
        placeholder: '请选择',
        allowClear: true,
        options: sampleArr,
        // showCheckedStrategy: 'Cascader.SHOW_CHILD', // 疑似多选模式才生效
        // expandTrigger: 'hover', // 鼠标悬停展开子项
        displayRender: ({ labels, selectedOptions }) => {
          // 返回自定义显示内容
          return labels.length >= 2 ? labels.slice(1, 2) : labels.slice(-1); // 只显示第二级
        },
      },
      formItemClass: 'col-span-3',
      label: '样品名称',
      fieldName: 'sampleName',
      rules: 'selectRequired',
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-3',
      label: '样品编号',
      fieldName: 'sampleNo',
      // rules: 'required',
      disabled: true,
    },
    {
      component: 'Select',
      componentProps: {
        placeholder: '请选择',
        options: [],
      },
      formItemClass: 'col-span-3',
      label: '委托人',
      fieldName: 'contactPerson',
      rules: 'selectRequired',
      dependencies: {
        triggerFields: ['sampleName'],
        // trigger: (values, formApi) => {
        //   if (!values.sampleName) {
        //     formApi.setFieldValue('contactPerson', undefined);
        //   } else {
        //     formApi.setFieldValue('contactPerson', contactPersonMap[0].value || undefined);
        //   }
        // },
        componentProps(values) {
          if (!values.sampleName) {
            return { options: [] };
          }
          const { sampleName } = values;
          // 获取样品名称在sampleArr中的索引
          const sampleIndex = sampleArr.findIndex((item) => item.value === sampleName[0]);
          if (sampleIndex >= 0 && sampleIndex <= 7) {
            // 纯气
            contactPersonMap = contactPersonOptions.slice(0, 2);
          } else if (sampleIndex >= 8 && sampleIndex <= 12) {
            contactPersonMap = contactPersonOptions.slice(2, 7);
          } else if (sampleIndex === 13) {
            contactPersonMap = contactPersonOptions;
          } else {
            contactPersonMap = [];
          }
          return { options: contactPersonMap };
        },
      },
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-6',
      label: '样品规格',
      fieldName: 'modelSpec',
      rules: 'required',
      dependencies: {
        triggerFields: ['sampleName'],
        trigger: (values, formApi) => {
          if (values.sampleName) {
            const sampleIndex = sampleArr.findIndex((item) => item.value === values.sampleName[0]);
            if (sampleIndex >= 0 && sampleIndex <= 7) {
              formApi.setFieldValue('modelSpec', values.sampleName.slice(-1)[0]); // 设置样品规格为样品名称的最后一个值
            }
          }
        },
        disabled(values) {
          if (values.sampleName) {
            const sampleIndex = sampleArr.findIndex((item) => item.value === values.sampleName[0]);
            if (sampleIndex >= 0 && sampleIndex <= 7) {
              return true;
            }
          } else {
            return true;
          }
        },
      },
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-3',
      label: '样品数量',
      fieldName: 'quantity',
      rules: 'required',
      dependencies: {
        triggerFields: ['sampleName'],
        disabled(values) {
          return !values.sampleName;
        },
      },
    },
    {
      component: 'Select',
      componentProps: {
        placeholder: '请选择',
        options: [],
      },
      formItemClass: 'col-span-3',
      label: '检测项目',
      fieldName: 'testItems',
      rules: 'selectRequired',
      dependencies: {
        triggerFields: ['sampleName'],
        // trigger: (values, formApi) => {
        //   if (!values.sampleName) {
        //     formApi.setFieldValue('testItems', undefined);
        //   } else {
        //     formApi.setFieldValue('testItems', testItemsMap[0].value || undefined);
        //   }
        // },
        componentProps(values) {
          if (!values.sampleName) {
            return {
              options: [],
            };
          }
          const { sampleName } = values;
          // 获取样品名称在sampleArr中的索引
          const sampleIndex = sampleArr.findIndex((item) => item.value === sampleName[0]);
          if (sampleIndex >= 0 && sampleIndex <= 9) {
            testItemsMap = testItemsArr.slice(0, 3);
          } else if (sampleIndex >= 10 && sampleIndex <= 11) {
            testItemsMap = testItemsArr.slice(3, 5);
          } else if (sampleIndex === 12) {
            testItemsMap = testItemsArr.slice(5, 7);
          } else if (sampleIndex === 13) {
            testItemsMap = testItemsArr;
          } else {
            testItemsMap = [];
          }

          return {
            options: testItemsMap,
          };
        },
        disabled(values) {
          return !values.sampleName;
        },
      },
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-6',
      label: '样品状态',
      fieldName: 'sampleStatus',
      rules: 'required',
      dependencies: {
        triggerFields: ['sampleName'],
        disabled(values) {
          return !values.sampleName;
        },
      },
    },
    {
      component: 'RadioGroup',
      componentProps: {
        optionType: 'button',
        buttonStyle: 'solid',
        options: [
          { label: '样品退回', value: true },
          { label: '检测单位自行处理', value: false },
        ],
      },
      formItemClass: 'col-span-3',
      label: '样品处理方式',
      fieldName: 'sampleHandling',
      rules: 'selectRequired',
      dependencies: {
        triggerFields: ['sampleName'],
        disabled(values) {
          return !values.sampleName;
        },
      },
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-3',
      label: '收样人',
      fieldName: 'receiver',
      rules: 'required',
      dependencies: {
        triggerFields: ['sampleName'],
        disabled(values) {
          return !values.sampleName;
        },
      },
    },
    {
      component: 'DatePicker',
      componentProps: {
        placeholder: '请选择',
        showTime: false,
        showToday: true,
        allowClear: true,
        format: 'YYYY年MM月DD日',
        picker: 'date',
        mode: 'date',
      },
      formItemClass: 'col-span-3',
      label: '收样日期',
      fieldName: 'receiveDate',
      rules: 'selectRequired',
      dependencies: {
        triggerFields: ['sampleName'],
        disabled(values) {
          return !values.sampleName;
        },
      },
    },
    {
      component: 'RadioGroup',
      componentProps: {
        optionType: 'button',
        buttonStyle: 'solid',
        options: currentProgressOptions,
      },
      formItemClass: 'col-span-6',
      label: '当前进度',
      fieldName: 'currentProgress',
      rules: 'selectRequired',
      dependencies: {
        triggerFields: ['sampleName'],
        disabled(values) {
          return !values.sampleName;
        },
      },
    },
    {
      component: 'DatePicker',
      componentProps: {
        showTime: false,
        showToday: true,
        allowClear: true,
        format: 'YYYY年MM月DD日',
        picker: 'date',
        mode: 'date',
      },
      formItemClass: 'col-span-3',
      label: '分析日期',
      fieldName: 'analysisDate',
      rules: 'selectRequired',
      dependencies: {
        triggerFields: ['receiveDate'],
        componentProps(values) {
          if (values.receiveDate) {
            return {
              disabledDate: (current: Dayjs) => {
                return current && current < dayjs(values.receiveDate).startOf('day');
              },
            };
          }
        },
        disabled(values) {
          return !values.receiveDate;
        },
      },
    },
    {
      component: 'Select',
      componentProps: {
        placeholder: '请选择',
        options: [],
      },
      formItemClass: 'col-span-3',
      label: '分析人',
      fieldName: 'tester',
      rules: 'required',
      dependencies: {
        triggerFields: ['sampleName', 'receiveDate'],
        componentProps(values) {
          if (!values.sampleName) {
            return {
              options: [],
            };
          }
          const { sampleName } = values;
          // 获取样品名称在sampleArr中的索引
          const sampleIndex = sampleArr.findIndex((item) => item.value === sampleName[0]);
          if (sampleIndex >= 0 && sampleIndex <= 7) {
            return {
              options: [
                { label: '肖开雷', value: '肖开雷' },
                { label: '王泉笙', value: '王泉笙' },
                { label: '胡建强', value: '胡建强' },
              ],
            };
          } else if (sampleIndex >= 8 && sampleIndex <= 12) {
            return {
              options: [
                { label: '杨小娟', value: '杨小娟' },
                { label: '肖玲', value: '肖玲' },
              ],
            };
          } else if (sampleIndex === 13) {
            return {
              options: [
                { label: '肖开雷', value: '肖开雷' },
                { label: '王泉笙', value: '王泉笙' },
                { label: '胡建强', value: '胡建强' },
                { label: '杨小娟', value: '杨小娟' },
                { label: '肖玲', value: '肖玲' },
              ],
            };
          } else {
            return {
              options: [],
            };
          }
        },
        disabled(values) {
          return !values.receiveDate;
        },
      },
    },
    {
      component: 'Select',
      componentProps: {
        placeholder: '请选择',
        options: [],
      },
      formItemClass: 'col-span-3',
      label: '取样/处理人',
      fieldName: 'processor',
      rules: 'required',
      disabled: true,
      dependencies: {
        triggerFields: ['contactPerson'],
        trigger: (value, formApi) => {
          formApi.setFieldValue('processor', value.contactPerson);
        },
      },
    },
    {
      component: 'DatePicker',
      componentProps: {
        showTime: false,
        showToday: true,
        allowClear: true,
        format: 'YYYY年MM月DD日',
        picker: 'date',
        mode: 'date',
      },
      formItemClass: 'col-span-3',
      label: '处理日期',
      fieldName: 'processDate',
      rules: 'selectRequired',
      dependencies: {
        triggerFields: ['analysisDate'],
        componentProps(values) {
          if (values.analysisDate) {
            return {
              disabledDate: (current: Dayjs) => {
                const res =
                  current < dayjs(values.analysisDate).startOf('day') ||
                  current > dayjs(values.analysisDate).add(3, 'month');
                return current && res;
              },
            };
          }
        },
        trigger: (values, formApi) => {
          if (values.analysisDate) {
            formApi.setFieldValue('processDate', dayjs(values.analysisDate).add(5, 'day'));
          }
        },
        disabled(values) {
          return !values.analysisDate;
        },
      },
    },
    {
      component: 'Textarea',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
        autoSize: true,
      },
      formItemClass: 'col-span-12',
      label: '收样备注',
      fieldName: 'remarks',
      // rules: 'required',
    },
    {
      component: 'Input',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
      },
      formItemClass: 'col-span-3',
      label: '报告编号',
      fieldName: 'reportNo',
      // rules: 'required',
      disabled: true,
    },
    {
      component: 'Textarea',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
        autoSize: true,
      },
      formItemClass: 'col-span-9',
      label: '报告备注',
      fieldName: 'reportNotes',
      // rules: 'required',
      dependencies: {
        triggerFields: ['reportNo'],
        disabled(values) {
          return !values.reportNo;
        },
      },
    },
    {
      component: 'Textarea',
      componentProps: {
        placeholder: '请输入',
        allowClear: true,
        autoSize: true,
      },
      formItemClass: 'col-span-12',
      label: '其他备注',
      fieldName: 'othersNotes',
      // rules: 'required',
    },
  ],
};
